/*
 * @Autor: dc
 * @Date: 2022-03-09 17:26:43
 * @LastEditors: dc
 * @LastEditTime: 2022-03-11 15:35:24
 * @Description: 
 */

import React, { Component } from 'react';
// 随机id
import { nanoid } from 'nanoid'
import './index.css'
class index extends Component {
    handleKeyUp = (event) => {
        const { keyCode, target } = event
        const { addTodos } = this.props
        if (keyCode != 13) {
            return
        }
        if (target.value.trim() === '') {
            alert('输入不能为空');
            return;
        }
        // 给父级回传内容
        addTodos({
            id: nanoid(),
            name: target.value,
            done: false
        })
        // 清空
        target.value = '';

    }
    render() {
        return (
            <div className="header">
                <input type="text"
                    onKeyUp={this.handleKeyUp}
                    placeholder="请输入你的任务名称，按回车健确认" />
            </div>
        );
    }
}

export default (index);